const { ipcRenderer } = require('electron');
Vue.use(ELEMENT);
const setting = proxyLocalStorage('setting');
const localData = proxyLocalStorage('data');
localData.count = 0;
localData.loginForPin = setting.pinSwitch;
const app = new Vue({
  el: '#app',
  data: {
    data: [],
    setting: { ...setting },
    // 窗口是否最大化
    isMaximize: false,
    // 某一个账户的操作历史
    historyList: [],
    // 账户信息
    accountInfo: {},
    // 在查看历史时，禁止编辑
    disabledInput: true,
    // 用户昵称
    nickname: '',
    // 用户头像
    headImg: '',
    // 版本号
    version: '',
    // 右键菜单
    menu: [],
    // 右键菜单x位置
    menuX: 0,
    // 右键菜单y位置
    menuY: 0,
    // 是否显示右键菜单
    menuSwitch: false,
    // 设置界面
    settingView: false,
    // 是否开启pin码登陆
    pinSwitch: true,
    // clickCount
    clickCount: 0,
    // 点击计时器
    timer: null,
  },
  methods: {
    // 最小化
    minimize() {
      this.isMaximize = false;
      ipcRenderer.send('minimize');
    },
    // 最大化
    maximize() {
      this.isMaximize = true;
      ipcRenderer.send('maximize');
    },
    // 取消最大化
    unmaximize() {
      this.isMaximize = false;
      ipcRenderer.send('unmaximize');
    },
    // 退出
    close() {
      ipcRenderer.send('close');
    },
    // 点击树形菜单
    nodeClick(node) {
      this.menuSwitch = false;
      if (node.children) {
        return;
      }
      node.historyList = node.historyList || [];
      this.accountInfo = Object.assign({}, node.historyList[ 0 ]);
      this.historyList = node.historyList;
      this.disabledInput = true;
    },
    // 查看历史版本
    reset(index) {
      this.disabledInput = index === 0;
      this.accountInfo = Object.assign({}, this.historyList[ index ]);
    },
    // 删除历史
    async removeHistory(index) {
      try {
        await this.$confirm('确认删除该历史记录吗？', '确认信息', {
          distinguishCancelAndClose: true,
          confirmButtonText: '确认',
          cancelButtonText: '放弃',
          customClass: 'messageBox'
        });
        this.historyList.splice(index, 1);
        this.$message({
          type: 'success',
          message: '已删除'
        });
      } catch (error) {
        console.log('cnadfkldjf')
      }
    },
    // 复制文本
    copy(text) {
      if (text) {
        ipcRenderer.send('copy', text);
        this.$message({
          message: '已复制到剪贴板，10秒后会自动清除',
          type: 'success'
        });
        return;
      }
      this.$message({
        message: '内容为空，无法复制！',
        type: 'warning'
      });
    },
    // 上传数据
    update() {
      ipcRenderer.send('update', JSON.stringify(this.data));
    },
    // 树形菜单判断是否可以拖动
    allowDrag(node) {
      return node.id !== 1;
    },
    // 树形菜单判断是否可以拖入
    allowDrop(_draggingNode, dropNode, type) {
      if (type === 'inner') {
        if (dropNode.data.type !== 'dir') {
          return false;
        }
      }
      return true;
    },
    // 右键菜单
    contextmenu(event, data) {
      this.menuX = event.x + 'px';
      this.menuY = (event.y - 15) + 'px';
      this.menuSwitch = true;
      if (data.type === 'dir') {
        if (data.id === 1) {
          this.menu = [
            { id: 1, label: '新建组' },
            { id: 1, label: '新建条目' },
          ];
        } else {
          this.menu = [
            { id: data.id, label: '新建条目' },
            { id: data.id, label: '删除' },
            { id: data.id, label: '重命名' },
          ];
        }
      } else {
        this.menu = [
          { id: data.id, label: '删除' },
          { id: data.id, label: '重命名' },
        ];
      }
    },
    // 菜单功能
    async clickMenu(id, label) {
      try {
        const tree = this.$refs.tree;
        switch (label) {
          case '新建组':
            const { value: groupName } = await this.$prompt('请输入组名称', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
            });
            tree.append({
              label: groupName,
              type: 'dir',
              id: Date.now().toString(),
            }, id);
            this.update();
            break;
          case '新建条目':
            const { value: name } = await this.$prompt('请输入条目名称', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
            });
            const node = {
              label: name,
              type: 'file',
              id: Date.now().toString(),
              historyList: [],
            };
            tree.append(node, id);
            app.$refs.tree.getNode(id).expanded = true;
            tree.setCurrentKey(node.id);
            this.nodeClick(node);
            this.update();
            break;
          case '删除':
            await this.$confirm('此操作将永久删除且不可逆转，是否继续?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            });
            tree.remove(tree.getNode(id));
            this.update();
            break;
          case '重命名':
            const { value: newName } = await this.$prompt('请输入新名称', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
            });
            tree.getNode(id).data.label = newName;
            this.update();
            break;
          default: break;
        }
      } catch (error) {
        console.log(error);
      }
    },
    // 退回到登陆界面
    quit() {
      ipcRenderer.send('quit');
    },
    // 保存新数据到历史记录
    save() {
      this.historyList.unshift(Object.assign({
        id: Date.now().toString(),
        content: '新增数据',
        timestamp: formatDate('yyyy-MM-dd hh:mm:ss'),
      }, this.accountInfo));
      this.update();
    },
    async pinSwitchChange(value) {
      try {
        if (value) {
          localData.loginForPin = false;
          const { value: pin } = await this.$prompt('请输入pin码', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            inputPattern: /^[\d]{4}$/,
            inputErrorMessage: '只能是4位纯数字'
          });
          ipcRenderer.send('pin', pin);
        }
        setting.pinSwitch = value;
      } catch (error) {
        this.setting.pinSwitch = false;
        console.log(error);
      }
    },
    dev() {
      if (this.clickCount < 10) {
        this.clickCount ++;
        clearTimeout(this.timer);
        this.timer = setTimeout(() => {
          this.clickCount = 0;
        }, 2000);
        return;
      }
      clearTimeout(this.timer);
      this.clickCount = 0;
      ipcRenderer.send('devMain');
    }
  }
});

// 点击菜单外地方取消右键菜单显示
document.oncontextmenu = document.onclick = () => {
  app.menuSwitch = false;
}

// 数据初始化
function login(_event, data) {
  app.nickname = data.nickname;
  app.headImg = data.headImg;
  app.data = data.data;
  app.version = data.version;
}

ipcRenderer.once('init', login);
ipcRenderer.once('newLogin', login);

ipcRenderer.on('pin', (_event, encrypted) => {
  localData.loginForPin = true;
  localData.encrypted = encrypted;
});

ipcRenderer.on('update', (_event, result) => {
  if (result.success) {
    app.$message({
      message: '更新成功，已上传云端！',
      type: 'success'
    });
    app.version = result.version;
  } else {
    app.$message({
      message: '仅本地更新',
      type: 'warning'
    });
  }
});

function proxyLocalStorage(key) {
  let data;
  try {
    data = JSON.parse(localStorage.getItem(key)) || {};
  } catch (error) {
    data = {};
  }
  return new Proxy(data, {
    get(target, propKey) {
      try {
        target = JSON.parse(localStorage.getItem(key));
        return target[ propKey ];
      } catch (error) {
        return undefined;
      }
    },
    set(target, propKey, value) {
      target[ propKey ] = value;
      localStorage.setItem(key, JSON.stringify(target));
      return true;
    },
    deleteProperty(target, delKey) {
      delete target[ delKey ];
      localStorage.setItem(key, JSON.stringify(target));
      return true;
    }
  });
}

function formatDate(fmt, date = new Date()) {
  const o = {
    //月份
    "M+": date.getMonth() + 1,
    // 日
    "d+": date.getDate(),
    // 小时
    "h+": date.getHours(),
    // 分钟
    "m+": date.getMinutes(),
    // 秒
    "s+": date.getSeconds(),
    // 季度
    "q+": Math.floor((date.getMonth() + 3) / 3),
    // 毫秒
    "S": date.getMilliseconds(),
  };
  if (/(y+)/.test(fmt)) {
    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
  }
  for (var k in o) {
    if (new RegExp("(" + k + ")").test(fmt)) {
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[ k ]) : (("00" + o[ k ]).substr(("" + o[ k ]).length)));
    }
  }
  return fmt;
}